window.onload = function () {
  var ps = document.getElementById("ps");

  //动态创建li标签
  for (var i = 0; i < 11; i++) {
    //创建li标签
    var li = document.createElement("li");
    ps.appendChild(li);

    //创建img标签
    var img = document.createElement("img");
    img.src = "images/pic" + (i + 1) + ".jpg";
    li.appendChild(img);
  }

  //获取所有的li
  var allLis = ps.children;

  var screenW = document.documentElement.clientWidth - 250;
  var screenH = document.documentElement.clientHeight - 360;

  //遍历
  for (var j = 0; j < allLis.length; j++) {
    //取出单个li标签
    var li = allLis[j];

    //随机分布
    li.style.left = _.random(0, screenW) + "px";
    li.style.top = _.random(0, screenH) + "px";

    //随机角度
    li.style.transform = "rotate(" + _.random(0, 360) + "deg)";

    //点击事件
    li.onclick = function () {
      for (var i = 0; i < allLis.length; i++) {
        allLis[i].className = "";
      }
      this.className = "current";
    };
  }
};
